<template>
	<a-modal :visible="visible" :title="title" @Ok="fun_submit" @cancel="fun_cancel">
		<a-form name="tt" v-model="formData" :label-col="{ span: 4 }" :wrapper-col="{ span: 18 }">
			<template v-for="item in columns_search" :key="item.dataIndex">
				<a-form-item :label="item.title" :name="item.dataIndex">
					<a-range-picker v-if="item.type == 'date' || item.type == 'datetime'" v-model:value="formData[item.dataIndex]" />
					<!-- <a-date-picker v-if="item.type == 'date'" v-model:value="formData[item.dataIndex]" placeholder="选择日期" />
					<a-date-picker v-else-if="item.type == 'datetime'" show-time v-model:value="formData[item.dataIndex]" placeholder="选择时间" /> -->
					<a-time-picker v-else-if="item.type == 'time'" v-model:value="formData[item.dataIndex]" placeholder="选择时间" />

					<a-textarea v-else-if="item.type == 'text'" v-model:value="formData[item.dataIndex]" />
					<a-radio-group v-else-if="item.type == 'radio'" v-model:value="formData[item.dataIndex]" :options="item.dict" />
					<a-checkbox-group v-else-if="item.type == 'checkbox'" v-model:value="formData[item.dataIndex]" name="checkboxgroup" :options="item.dict" />
					<a-select v-else-if="item.type == 'select'" v-model:value="formData[item.dataIndex]" :options="item.dict"></a-select>

					<a-input-number v-else-if="item.type == 'int' || item.type == 'long' || item.type == 'decimal'" v-model:value="formData[item.dataIndex]" style="width: 100%" />
					<a-input v-else v-model:value="formData[item.dataIndex]" />
				</a-form-item>
			</template>
		</a-form>
	</a-modal>
</template>

<script>
export default {
	name: 'tableSearch',
	props: ['columns_search', 'visible'],
	data() {
		return {
			title: '搜索',
			formData: {},
		};
	},
	mounted() {},
	methods: {
		fun_getData(id) {
			var that = this;
		},
		/**
		 * @function 提交搜索
		 */
		fun_submit() {
			var that = this;
			var filters = [];
			that.columns_search.forEach((elem, index) => {
				if (elem.type == 'date' || elem.type == 'datetime' || elem.type == 'time') {
					if (that.formData[elem.dataIndex] != undefined) {
						filters.push({ Name: elem.dataIndex, Type: '>=', Value: this.$dayjs(that.formData[elem.dataIndex][0]).format('YYYY-MM-DD') });
						filters.push({ Name: elem.dataIndex, Type: '<=', Value: this.$dayjs(that.formData[elem.dataIndex][1]).format('YYYY-MM-DD') });
					}
				} else {
					if (that.formData[elem.dataIndex] != undefined) {
						filters.push({ Name: elem.dataIndex, Type: elem.filter, Value: that.formData[elem.dataIndex] });
					}
				}
			});
			if (filters.length <= 0) {
				location.hash = '#';
			} else {
				location.hash = '#' + JSON.stringify(filters);
			}
			this.$parent.fatherRefresh(false, false, 'search');
		},
		/**
		 * @function 取消搜索
		 */
		fun_cancel() {
			this.$parent.fatherRefresh(false, false, 'search');
		},
	},
};
</script>

<style></style>
